import QtQuick 2.6
import Sailfish.Silica 1.0
import "../config"

Item {
    width: parent.width
    height: Theme.itemSizeSmall
    property string title: qsTr("标题")
    property bool checked: false

    Rectangle{
        id:switchBackground
        anchors.fill: parent
        visible: AppColor.themeModeIndex!=2
        color: AppColor.themeMode.transparent
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            checked = !checked
        }

        onPressed: switchBackground.color = AppColor.themeMode.primaryComponentColor

        onReleased: switchBackground.color = AppColor.themeMode.transparent
    }

    Row {
        id:root
        width: parent.width
        height: label.height
        leftPadding: Theme.horizontalPageMargin
        rightPadding: Theme.horizontalPageMargin
        anchors.verticalCenter: parent.verticalCenter
        spacing: 0

        Label {
            id:label
            text: title
            truncationMode: TruncationMode.Fade
            color: AppColor.themeMode.primaryColor
            anchors.verticalCenter: parent.verticalCenter
        }

        Item {
            id: spa
            height: parent.height
            width: parent.width-Theme.horizontalPageMargin*2-label.implicitWidth-background.width
        }


        Rectangle {
            id: background
            height: label.height
            width: height * 2
            radius: height / 2
            color: checked?AppColor.themeMode.themeColor : AppColor.themeMode.secondaryComponentColor
            anchors.verticalCenter: parent.verticalCenter

            Rectangle {
                id: handle
                width: background.height-16
                height: width
                radius: width / 2
                color: checked?AppColor.themeMode.primaryComponentColor : AppColor.themeMode.primaryComponentColor
                x: checked ? (parent.width - width-8) : 8
                anchors.verticalCenter: parent.verticalCenter
            }
        }

    }
}


